document.querySelector('.search').addEventListener('click', function () {
    location.href = './search.html'

})

// 商品分类模块
async function category() {
    const res = await axios({
        url: '/category/list',
    })
    console.log(res.data.data.list)
    let str = ''
    let str1 = ''
    res.data.data.list.forEach(ele => {
        // console.log(ele)
        str += `<a href="javascript:;" data-id ="${ele.category_id}">${ele.name}</a>`
        if (ele.children) {
            // console.log(ele.children)
            ele.children.forEach(element => {
                str1 += `<a href="javascript:;" data-id=${element.parent_id} class="imgaut img${element.parent_id}">
                <img src="${element.image.external_url}" alt="" />
                <p>${element.name}</p>
              </a>`
            })

        }
    });
    document.querySelector('.left').innerHTML = str
    document.querySelector('.right').innerHTML = str1
    document.querySelector('.left a').classList.add('active')

    document.querySelectorAll('.imgaut').forEach(ele => {
        ele.style.display = "none";
    })
    document.querySelectorAll(
        ".right " + `.img${document.querySelector(".left a").dataset.id}`
    )
        .forEach((element) => {
            element.style.display = "block";
        });
}
category()

document.querySelector('.left').addEventListener('click', function (e) {
    if (e.target.tagName === 'A') {
        document.querySelector('.left .active').classList.remove('active')
        e.target.classList.add('active')
        document.querySelectorAll('.imgaut').forEach(ele => {
            ele.style.display = 'none'
        })
        document.querySelectorAll('.img' + e.target.dataset.id).forEach(ele => {
            ele.style.display = 'block'
        })
    }
})

document.querySelector('.right').addEventListener('click', function (e) {
    if (e.target.tagName === 'IMG' || e.target.tagName === 'P') {
        location.href = "goodsList.html?categoryId=" + e.target.parentNode.dataset.id;
    }
})